<template>
	<div class="main">
		<div class="title"><span>评教首页</span></div>
		<!-- <div class="head">
			<van-image
			  class="image"
			  round
			  width="2rem"
			  height="2rem"
			  src="https://fastly.jsdelivr.net/npm/@vant/assets/cat.jpeg"
			/>
			<van-search
			  v-model="value"
			  shape="round"
			  background="blue"
			  placeholder="请输入搜索关键词"
			  @search="onSearch"
			  @cancel="onCancel"
			/>
			<van-icon class="icon" name="envelop-o" color="white" dot size="34" />
		</div> -->
		<div class="swipe">
			<van-swipe class="my-swipe" :autoplay="3000" indicator-color="white">
			  <van-swipe-item v-for="image in images" :key="image"><img :src="image"/></van-swipe-item>
			  
			</van-swipe>
		</div>
		<div class="list"><span>评教列表</span></div>
		<!-- <div class="evaluationList">
			<div class="term">学期</div>
			<div class="name">标题</div>
		</div> -->
		<van-collapse v-model="activeNames" v-for="item in term" @change="getActivityLists(item)"  >
		 <!-- <div @click="getActivityLists(item)"> -->
			 <van-collapse-item  :title="item" :name="item.evaluationPaperId">
		   <div class="evaluationList" v-for="item1 in activityList">
		   	<div class="term" @click="topj(item1.evalutionActivity.evalutionActivityId)">{{item1.paperName}}</div>
		   	<!-- <div class="name">标题</div> -->
		   </div>
		  </van-collapse-item>
		 <!-- </div> -->
		</van-collapse>
		<!-- <div class="groups">
			<div class="icon-group">
				<van-icon class="iconfont icon-kebiao"  size="30" color="red"></van-icon>
				<span class="name">我的课表</span></div>
			<div class="icon-group" >
				<van-icon class="iconfont icon-pingjiao" size="30"  color="red" @click="topj()"></van-icon>
				<span class="name">学生评教</span></div>
			<div class="icon-group">
				<van-icon class="iconfont icon-chengjiguanli"  size="30" color="red"></van-icon>
				<span class="name">我的成绩</span></div>
		</div> -->
		<div class="low">
			<router-view></router-view>
			<van-tabbar v-model="active" route>
			  <van-tabbar-item replace to="/index" icon="home-o">首页</van-tabbar-item>
			 <!-- <van-tabbar-item replace to="/server" icon="search">服务中心</van-tabbar-item> -->
			  <!-- <van-tabbar-item icon="friends-o">标签</van-tabbar-item> -->
			  <van-tabbar-item replace to="/person" icon="setting-o">个人信息</van-tabbar-item>
			</van-tabbar>
		</div>
	</div>
</template>

<script>
	import { ref } from 'vue';
	import { Row, Toast } from 'vant';
	import {getActivityList,getInfo,getTerm,getActivityPaper} from '@/api/pj'
import index from '@vue/babel-plugin-transform-vue-jsx';
	export default {
	  data() {
	  	return{
			value:"",
			images : [
			      'https://tse4-mm.cn.bing.net/th/id/OIP-C.stIO7xAz-3PIUxtQgA-KJgHaHa?w=208&h=208&c=7&r=0&o=5&dpr=1.3&pid=1.7',
			      'https://tse4-mm.cn.bing.net/th/id/OIP-C.nBqJfQxqsNvOA7tf7t_qBgHaE8?w=284&h=189&c=7&r=0&o=5&dpr=1.3&pid=1.7',
			    ],
			active:0	,
			activeNames:[],
			activityList:[],
			evaluationPaper:{},
			activityId:null,
			term:[]
		}
	  },
	  created() {
		  this.getTerms()
	  	// this.getActivityLists();
		
	  },
	  methods:{
		  topj(activityId){
			  this.$router.push({path:'/pj',query:{index:activityId}})
		  },
		  async getActivityLists(term){
			  // //待评价
			  // const status="1"
			  const result=await getActivityPaper(term);
			  if(result.code==200){
				  console.log(result)
				  this.activityList=result.data;
				  
			  }
		  },
		  async getTerms(){
			  const status="2"
			  const result=await getTerm(status);
			  if(result.code==200){
			  				  // console.log(result)
			  				  this.term=result.data;
							  
			  				  
			  }
		  },
		  // async getEvaluationPaper(evaluationPaperId){
			 //  console.log(evaluationPaperId)
			 //  const result=await getInfo(evaluationPaperId);
			 //  if(result.code==200){
				//   // console.log(result)
				//   this.evaluationPaper=result.data
			 //  }
		  // }
	  }
	};
</script>

<style scoped>
	.main .title{
		text-align: center;
		padding-top: 10px;
		font-size: 24px;
	}
	.head{
		display: flex;
		background-color: blue;
		height: 100px;
	}
	.head .image{
		padding: 10px 0 0 8px;
	}
	.head .icon{
		padding: 12px 0 0 38px;
	}
	.swipe{
		padding-top: 10px;
		padding-bottom: 8px;
		/* width: 100%; */
		/* height: 300px; */
	}
	 .my-swipe .van-swipe-item {
	    color: #fff;
	    font-size: 20px;
	    /* line-height: 150px; */
	    text-align: center;
	    background-color: #39a9ed;
	  }
/* 	.groups{
		display: flex;
		
	}
	.icon-group{
		display: flex;
		flex-direction: column;
		padding-left: 50px;
		padding-top: 5px;
	}
	.groups .name{
		position: relative;
		top: 5px;
		right: 12px;
		font-size: 16px;
	} */
	.swipe img{
		width: 98%;
		height: 150px;
	}
	.evaluationList{
		/* padding-top: 6px; */
		font-size: 20px;
	}
	.evaluationList .name{
		padding-left: 6px;
	}
	.evaluationList .term{
		padding-left: 6px;
		color: #000;
	}
	.list{
		padding: 5px 0 0 5px;
		font-size: 24px;
		border: #39a9ed solid 1px;
		/* border-radius: 8%; */
		background-color: #39a9ed;
	}
</style>